import React, {useEffect, useState} from 'react';
import style from './Crumbs.module.scss'
import {Breadcrumb} from 'antd';
import {useLocation} from "react-router-dom";
import menuList from "../../router/menuLeftList";
// 面包屑
function Crumbs(props) {
    const location = useLocation();
    const [bread, setBread] = useState([])


    useEffect(() => {
        menuList.forEach(i => {
            if (i.children) {
                i.children.forEach(j => {
                    if (j.key === location.pathname) {
                        setBread([
                            {title: i.label},
                            {title: j.label}
                        ])
                    }
                })
            } else {
                if (i.key === location.pathname) {
                    setBread([
                        {title: i.label},
                    ])
                }
            }

        })
    }, [location])
    return (
        <div className={style.crumbs}>
            <div><Breadcrumb items={bread}></Breadcrumb></div>
        </div>
    );
}

export default Crumbs;
